<style lang="less" scoped>
.msg {
  margin: 15px;
  .smallForm {
    display: inline-block;
  }
}
</style>

<template>
  <div class="msg">
    <Card :bordered="false">
      <p slot="title">日志 > <span class="select-font">短信日志</span></p>
      <div>
        <Form :model="formItem"
              class="smallForm">
          <Input v-model="formItem.name"
                 :maxlength="20"
                 style="width:200px;"
                 placeholder="请输入接收人名称"></Input>
          <Button type="info"
                  style="margin-left:25px"
                  @click="getData('1')">搜索</Button>
        </Form>
      </div>
    </Card>
    <div class="">
      <Table :data="logData"
             :columns="logColumns"
             stripe></Table>
      <Page class="pull-right"
            :total="Page.total"
            :current="Page.current"
            :page-size="Page.pageSize"
            size="small"
            show-total
            @on-change="changePage"></Page>
    </div>
  </div>
</template>

<script>
import { ajaxPost } from 'global/axios';
import storage from 'good-storage';
export default {
  data() {
    return {
      urlLogList: '/sys/phonemsg/list',
      logData: [],
      logColumns: [
        {
          title: '接收人',
          key: 'receive_realname',
        },
        {
          title: '接收电话',
          key: 'receive_phone',
        },
        {
          title: '类型',
          key: 'msg_type',
        },
        {
          title: '时间',
          key: 'date_time',
        },
      ],
      formItem: {
        name: '',
      },
      Page: {
        current: 1,
        pageSize: 13,
        total: 0,
      },
      actionPage: '1',
    };
  },
  methods: {
    getData(page) {
      let params = {
        data: {
          page,
          pageSize: this.Page.pageSize,
          searchValue: {},
          order: { date_time: -1 },
          basis: 2,
        },
        url: this.urlLogList,
        token: storage.session.get('token'),
        success: res => {
          this.$Loading.finish();
          this.logData = res.data.result.result;
          this.Page.total = res.data.result.totalSize;
        },
      };
      if (this.formItem.name !== '') {
        params.data.searchValue.receive_realname = `${this.formItem.name}|#|like`;
      }
      ajaxPost(params);
    },
    changePage(page) {
      this.actionPage = page;
      this.getData(page);
    },
  },
  mounted() {
    this.getData('1');
  },
};
</script>
